<template>

  <n-popover trigger="click" placement="bottom-end">
    <template  #trigger>
      <n-button @click="show = !show" round
                class="transition-all transition-500"
                style="padding-right: 0; padding-left: 30px"
                :class="[show?'-translate-x-1/2':'-translate-x-1/4']"
                type="success">
        <TextIcon v-if="show" icon="icon-park-outline:expand-right" tip="收回目录"></TextIcon>
        <TextIcon v-else icon="icon-park-outline:expand-left" tip="打开目录"></TextIcon>
      </n-button>
    </template>
    <slot></slot>
  </n-popover>
</template>

<script setup lang="ts">


import TextIcon from "@/components/pc/icon/TextIcon.vue";
import {useVModel} from "@vueuse/core";


const props = defineProps({
  isShow: {
    type: Boolean,
    default: false
  }
})
const emit = defineEmits(['update:isShow'])

const show = useVModel(props, 'isShow', emit)

</script>

<style scoped>


</style>